import Vue from 'vue'
import VueRouter from 'vue-router'

// 引入组件：
import Login from '@/views/login/index'
import Layout from '@/views/layout/index'
import Dashboard from '@/views/dashboard/index'
import Article from '@/views/article/index'

// 引入 store，目的是为了获得 vuex 中的 token，设置前置守卫
import store from '@/store'

Vue.use(VueRouter)

const router = new VueRouter({
  routes: [{
      path: '/login',
      component: Login
    },
    {
      path: '/',
      component: Layout,
      redirect: '/dashboard',
      children: [
        { path: '/dashboard', component: Dashboard },
        { path: '/article', component: Article }
      ]
    }
  ]
})

// 路由前置守卫：
// 在每一个路由在真正被访问到之前，都会先经过路由前置导航守卫
// 只有前置导航守卫放行了，才能访问到对应的页面
// 每个路由即将被访问匹配时，都会调用 beforeEach的回调函数
// to: 往哪去，要去的路由对象（路径，参数）
// from：从哪来，从哪个地址过来的
// next是否放行：
// （1）next() 即放行
// （2）next('/路径')，拦截到某页面

// 1、判断是否有 token 如果有，放行
// 2、没有 token，但是要去 login 或者 register，放行
// 3、没有 token，去其他地方，不放行

// 白名单页面数组：
const whitePage = ['/login']
router.beforeEach((to, from, next) => {
  // 从 vuex 中找寻 token
  if (store.state.user.token) {
    next()
  } else if (!store.state.user.token && whitePage.includes(to.path)) {
    next()
  } else {
    next({ path: '/login' })
  }
})

export default router